<template>
	<el-container v-loading="loading">
		<el-container>
			<el-header>
				<div class="left-panel">
					<!--					<el-button type="primary" v-auth="'admin:doctor:edit'" icon="el-icon-plus" @click="handleData('add')"></el-button>-->
				</div>
				<div class="right-panel">
					<div class="right-panel-search">
						<el-input v-model="search.doctor_name" placeholder="医生姓名" clearable style="min-width:15%;"></el-input>
						<el-input v-model="search.mobile" placeholder="手机号" clearable style="min-width:15%;"></el-input>
						<el-select v-model="search.job_title" placeholder="职称" style="min-width:15%;" clearable>
							<el-option v-for="item in job_title_list" :key="item.job_title" :label="item.job_title_name" :value="item.job_title">
							</el-option>
						</el-select>
						<el-select v-model="search.work_status" placeholder="工作状态" style="min-width:15%;" clearable>
							<el-option v-for="item in work_status_list" :key="item.work_status" :label="item.work_status_name" :value="item.work_status">
							</el-option>
						</el-select>
						<el-select v-model="search.job_status" placeholder="出诊状态" style="min-width:15%;" clearable>
							<el-option v-for="item in job_status_list" :key="item.job_status" :label="item.job_status_name" :value="item.job_status">
							</el-option>
						</el-select>
						<el-input v-model="search.department_name" placeholder="选择科室" @click="openDepartment" @clear="clearDepartment"
									  clearable></el-input>
						<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
						<el-button type="info" @click="resetsearch">重置</el-button>
					</div>
				</div>
			</el-header>
			<el-main class="nopadding">
				<scTable ref="table" :apiObj="apiObj" @selection-change="selectionChange" stripe remoteSort
						 remoteFilter>
					<el-table-column type="selection" width="50"></el-table-column>
					<el-table-column label="医生姓名" prop="doctor_name" width="100"></el-table-column>
					<el-table-column label="手机号" prop="mobile" width="150"></el-table-column>
					<el-table-column label="科室" prop="department_name" width="150"></el-table-column>
					<el-table-column label="职称" prop="job_title_name" width="150"></el-table-column>
					<el-table-column label="工作状态" prop="work_status_name" width="150"></el-table-column>
					<el-table-column label="接诊状态" prop="job_status_name" width="150"></el-table-column>
					<el-table-column label="账号状态" prop="user_status_name" width="150"></el-table-column>
					<el-table-column label="备案状态" prop="record_status_name" width="150"></el-table-column>
					<el-table-column label="创建时间" prop="created_at" width="170"></el-table-column>
					<el-table-column label="创建人" prop="created_by" width="170"></el-table-column>
					<el-table-column label="操作" fixed="right" align="right" width="160">
						<template #default="scope">
							<el-button-group>
								<!--								<el-button text type="primary" size="small"-->
								<!--										   @click="handleData('show',scope.row, scope.$index)">查看-->
								<!--								</el-button>-->
								<el-button text type="primary" v-auth="'admin:doctor:edit'" size="small"
										   @click="handleData('edit',scope.row, scope.$index)">修改
								</el-button>
								<el-button text type="primary" size="small"
										   @click="changeUserStatus(scope.row)">{{scope.row.user_status==1?'停用':'启用'}}
								</el-button>
								<el-button text type="primary" v-auth="'user:doctor:delete'" size="small"
										   @click="deleteDoctor('delete',scope.row, scope.$index)">删除
								</el-button>
								<el-button v-if="scope.row.record_status != 1" text type="primary" v-auth="'user:doctor:changeRecordStatus'" size="small"
										   @click="changeRecordStatus(scope.row, scope.$index)">修改备案状态
								</el-button>
							</el-button-group>
						</template>
					</el-table-column>
				</scTable>
			</el-main>
		</el-container>
	</el-container>
	<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-dialog>
</template>

<script>
	import saveDialog from './save.vue';

	export default {
		name: 'doctor',
		components: {
			saveDialog,
		},
		data() {
			return {
				dialog: {
					save: false
				},
				showGroupLoading: false,
				loading: false,
				apiObj: this.$API['admin.doctor'].list,
				selection: [],
				search: {
					doctor_name: "",
					mobile: "",
					job_title: "",
					work_status: "",
					job_status: "",
				},
				job_title_list: [],
				work_status_list: [],
				job_status_list: [],
				//选择科室 弹窗
				departmentPopupShow: true,
			}
		},
		mounted() {
			this.getSearchDict();
		},
		methods: {
			getSearchDict() {
				this.$API['admin.doctor'].getSearchDict.get().then((res) => {
					if (res.code == 0) {
						this.job_title_list = res.data.job_title_list;
						this.work_status_list = res.data.work_status_list;
						this.job_status_list = res.data.job_status_list;
					}
				}).catch((msg) => {
					this.$alert(msg, "提示", {type: 'error'})
				})
			},
			//添加
			add() {
				this.dialog.save = true
				this.$nextTick(() => {
					this.$refs.saveDialog.open()
				})
			},
			//编辑
			handleData(mode, row) {
				this.dialog.save = true
				this.$nextTick(() => {
					this.$refs.saveDialog.open(mode).setData(row)
				})
			},
			//删除
			deleteDoctor(mode, row) {
				console.log(mode, row);
				this.$confirm(`注：确认删除医生吗？`, '提示', {
					type: 'warning',
					confirmButtonText: '确定',
					confirmButtonClass: 'el-button--danger'
				}).then(() => {
					this.$API['admin.doctor'].deleteDoctor.post({doctor_id: row.doctor_id})
						.then((res) => {
							if (res.code == 0) {
								this.$refs.table.refresh()
								this.$message.success("操作成功")
							} else {
								this.$alert(res.message, "提示", {type: 'error'})
							}
						})
						.catch((msg) => {
							this.$alert(msg, "提示", {type: 'error'})
						})
						.finally(() => {

						});
				}).catch(() => {
				})

			},
			//启用停用医生登录账号状态
			changeUserStatus(row) {
				var status = row['user_status'] == 1 ? 0 : 1;
				var tip = status == 1 ? '启用' : '停用';
				this.$confirm('注：确认' + tip + '医生登录账号吗？', '提示', {
					type: 'warning',
					confirmButtonText: '确定',
					confirmButtonClass: 'el-button--danger'
				}).then(() => {
					this.$API['admin.user'].changeStatus.post({status: status, user_id: row.user_id})
						.then((res) => {
							if (res.code == 0) {
								this.$refs.table.refresh()
								this.$message.success("操作成功")
							} else {
								this.$alert(res.message, "提示", {type: 'error'})
							}
						})
						.catch((msg) => {
							this.$alert(msg, "提示", {type: 'error'})
						})
						.finally(() => {

						});
				}).catch(() => {
				})
			},
			//表格选择后回调事件
			selectionChange(selection) {
				this.selection = selection;
			},
			//搜索
			upsearch() {
				this.$refs.table.upData(this.search)
			},
			//本地更新数据
			handleSuccess() {
				this.dialog.save = false
				this.$refs.table.reload()
			},
			//重置
			resetsearch() {
				this.search = {
					doctor_name: "",
					mobile: "",
					job_title: "",
					work_status: "",
					job_status: "",
					department_code:'',
					department_name:''
				}
			},
			//所属科室弹窗
			openDepartment() {
				this.departmentPopupShow = true;
				this.$refs.departmentPopup.open()
			},
			//科室选择成功后
			departmentPopupSuccess(selection) {
				if (!selection){
					this.$alert('请选择科室', '提示', { type: 'error' });
					return false;
				}
				if(selection.length != 1){
					this.$alert('只能选择一个科室', '提示', { type: 'error' });
					return false;
				}
				let department_code = '';
				let department_name = '';
				selection.forEach(val => {
					department_code = val.department_code;
					department_name = val.department_name;
				});
				this.search.department_code = department_code;
				this.search.department_name = department_name;
				this.$refs.departmentPopup.close();
			},
			clearDepartment(){
				this.search = {
					department_code:'',
					department_name:''
				}
			},
			//修改医生备案状态
			changeRecordStatus(row) {
				this.$confirm(`注：确认修改医生为已备案吗？`, '提示', {
					type: 'warning',
					confirmButtonText: '确定',
					confirmButtonClass: 'el-button--danger'
				}).then(() => {
					this.$API['admin.doctor'].changeRecordStatus.post({doctor_id: row.doctor_id})
						.then((res) => {
							if (res.code == 0) {
								this.$refs.table.refresh()
								this.$message.success("操作成功")
							} else {
								this.$alert(res.message, "提示", {type: 'error'})
							}
						})
						.catch((msg) => {
							this.$alert(msg, "提示", {type: 'error'})
						})
						.finally(() => {

						});
				}).catch(() => {
				})

			},
		}
	}
</script>

<style>
</style>
